<template>
  <div>
    <div>
      <!-- <p v-for="(line,index) in content.contentDescription" :key="index">{{line}}</p> -->
      <el-alert type="success" :closable="false">
        <p v-for="(line, index) in content.contentDescription" :key="index">
          {{ line }}
        </p>
      </el-alert>
    </div>
    <!-- <div>MainView</div> -->
    <div v-for="(item, index) in content.content" :key="index">
      <p>{{ item.index }}.&nbsp;{{ item.subject }}</p>
      <el-radio-group v-model="radioValue[index]">
        <el-radio
          v-for="option in item.options"
          :key="option"
          :label="option"
          style="width:100%;margin-bottom:1em"
        ></el-radio>
      </el-radio-group>
      <p>如有以下情况请勾选：</p>
      <el-checkbox-group v-model="checkValue[index]">
        <el-checkbox
          v-for="subitem in item.subitems"
          :key="subitem"
          :label="subitem"
          style="width:100%;margin-bottom:1em"
        ></el-checkbox>
      </el-checkbox-group>
      <el-divider></el-divider>
    </div>
    <div style="text-align:center">
      <br />
      <el-button type="primary" @click="handleNext()" style="width:50%"
        >完成</el-button
      >
    </div>
  </div>
</template>

<script>
import { mapState } from "vuex";
export default {
  name: "mainView",
  data() {
    return {
      radioValue: [],
      checkValue: [],
      errMsg: ""
    };
  },
  computed: {
    ...mapState(["current", "content"]),
    questions() {
      let questions = [];
      for (let i = 0; i < this.content.content.length; i++) {
        questions.push(this.content.content[i].subject);
      }
      return questions;
    }
  },
  methods: {
    handleCalc() {
      let radioCalc = 0;
      let checkCalc = 0;
      let radioText = "";
      let checkText = "";
      let mixedText = "";
      for (let i = 0; i < this.radioValue.length; i++) {
        radioCalc += this.content.rules[this.radioValue[i]];
      }
      for (let i = 0; i < this.checkValue.length; i++) {
        checkCalc += this.checkValue[i].length;
      }
      //subject
      for (let i = 0; i < this.content.results.subject.length; i++) {
        if (
          radioCalc >= this.content.results.subject[i].range[0] &&
          radioCalc <= this.content.results.subject[i].range[1]
        ) {
          radioText = this.content.results.subject[i].text;
        }
      }
      //subitems
      for (let i = 0; i < this.content.results.subitems.length; i++) {
        if (
          checkCalc >= this.content.results.subitems[i].range[0] &&
          checkCalc <= this.content.results.subitems[i].range[1]
        ) {
          checkText = this.content.results.subitems[i].text;
        }
      }
      //mixed
      for (let i = 0; i < this.content.results.mixed.length; i++) {
        if (
          radioCalc >= this.content.results.mixed[i].range[0] &&
          radioCalc <= this.content.results.mixed[i].range[1] &&
          checkCalc >= this.content.results.mixed[i].range[2] &&
          checkCalc <= this.content.results.mixed[i].range[3]
        ) {
          mixedText = this.content.results.mixed[i].text;
        }
      }
      // this.$message.warning(radioText);
      // this.$message.warning(checkText);
      // this.$message.success(mixedText);
      console.log(radioText);
      console.log(checkText);
      console.log(mixedText);
      return {
        val: [radioCalc, checkCalc],
        msg: [radioText, checkText, mixedText]
      };
    },
    handleNext() {
      if (this.handleCheck()) {
        this.handleSet(this.handleCalc(), {
          questions: this.questions,
          radio: this.radioValue,
          check: this.checkValue
        });
        this.$emit("switch");
      }
    },
    handleCheck() {
      this.errMsg = "";
      for (let i = 0; i < this.radioValue.length; i++) {
        if (this.radioValue[i].length == 0) {
          // this.errMsg = "";
          this.$message.error("请您先完成第 " + (i + 1) + " 题");
          return false;
        }
      }
      return true;
    },
    handleSet(value, details) {
      // this.$store.commit("SET_CURRENT_SCORES", value);
      this.$store.dispatch("saveData", { value, details });
    },
    initialize() {
      for (let i = 0; i < this.content.content.length; i++) {
        this.radioValue.push("");
        this.checkValue.push([]);
      }
    }
  },
  created() {
    this.initialize();
  }
};
</script>

<style></style>
